.cube-button {
  position: absolute;
  padding: 3px;
  width: 30px;
  height: 30px;
  border: transparent;
  color: #27292a;
  background-color: transparent;
}

.home {
  left: 0;
}

.arrow-wrapper {
  top: 5px;
}

.arrow-wrapper .right {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.arrow-wrapper .down {
  bottom: 0%;
  left: 50%;
  transform: translateX(-50%);
}

.arrow-wrapper .left {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.arrow-wrapper .r-l {
  left: 20%;
}

.arrow-wrapper .up {
  left: 50%;
  transform: translateX(-50%);
}

.arrow-wrapper .r-r {
  right: 20%;
}

.arrow-wrapper .z-up {
  right: 0%;
}

.selected {
  background-color: #ffffff;
}

/* 基础图标按钮样式 */
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  background: none;
  border: none;
  border-radius: 4px; /* 默认圆角 */
  cursor: pointer;
  transition: all 0.3s ease;
  color: rgb(0, 0, 0); /* 默认图标颜色 */
}

/* 鼠标悬停效果 */
.icon-btn:hover {
  color: #1890ff; /* 悬停时图标颜色 */
  background-color: rgba(0, 0, 0, 0.04); /* 悬停时轻微背景色 */
  border-radius: 50%; /* 悬停时背景变为圆形 */
}

/* 按钮点击效果 */
.icon-btn:active {
  color: #096dd9; /* 点击时图标颜色 */
}

/* 禁用状态 */
.icon-btn:disabled {
  color: rgba(0, 0, 0, 0.25);
  cursor: not-allowed;
  background-color: transparent;
}

/* 图标样式 */
.icon-btn img {
  width: 16px;
  height: 16px;
}
